<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport"
        content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <title>属性</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
    <style>
        body {
            max-height: 600px;
        }

        body::-webkit-scrollbar {
            /*滚动条整体样式*/
            width: 8px;
            /*高宽分别对应横竖滚动条的尺寸*/
            height: 8px;
            scrollbar-arrow-color: red;
        }

        body::-webkit-scrollbar-thumb {
            border-radius: 5px;
            -webkit-box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
            box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
            background: rgba(218, 218, 218, 0.5);
            scrollbar-arrow-color: red;
        }

        body::-webkit-scrollbar-track {
            -webkit-box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
            box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
            border-radius: 0;
            background: rgba(218, 218, 218, 0.1);
        }

        html,
        body,
        #Attribute {
            background-color: rgba(0, 0, 0, 0);
            color: #fff;
        }

        .layui-form-item {
            border: 1px #fff solid;
            margin-bottom: 0px !important;
            border-bottom: none;
        }

        .layui-input {
            background-color: #fff !important;
            height: 30px;
            margin-top: 5px
        }

        .active {
            border: 1px solid #fc0 !important;
            box-shadow: 0 0 8px #ddd;
            -moz-box-shadow: 0 0 8px #ddd;
            -webkit-box-shadow: 0 0 8px #ddd;
            cursor: pointer;
        }


        .layui-form-label {
            width: 100px !important;
            padding: 11px 15px !important;
            border-right: 1px #fff solid;
            font-weight: bold !important;
            font-size: 14px;
            text-align: center;
        }

        .layui-input-block {
            width: 150px !important;
            margin-left: 150px !important;
        }

        .mCSB_container {
            margin-right: 17px !important;
        }

        legend {
            text-align: center;
            font-size: 16px;
            font-weight: bold;
            margin-bottom: 15px;
            margin-top: 20px;
        }

        .removeGraphic {
            position: absolute;
            top: -9px;
            right: 0;
        }

        .attrTitle {
            position: relative;
        }

        .topRadius {
            display: none;
        }

        .color {
            height: 42px;
        }

        .layui-form-selected dl {
            color: #000 !important;
        }
    </style>
</head>

<body>
    <div id="Attribute" style="margin: 10px;">
        <div class="attrTitle">
            <legend>属性信息</legend>
            <!-- <button type="button" class="layui-btn layui-btn-danger removeGraphic" onclick="removeGraphic()">移除</button> -->
        </div>
        <!--属性显示lable-->
        <div class="props attributelable" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">FEATUREGUI</label>
                    <div class="layui-input-block">
                        <input type="text" name="text1" readonly="true" lay-verify="title" autocomplete="off"
                            placeholder="0" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">FCODE</label>
                    <div class="layui-input-block">
                        <input type="text" name="text2" readonly="true" lay-verify="title" autocomplete="off"
                            placeholder="0" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">NAME</label>
                    <div class="layui-input-block">
                        <input type="text" name="text3" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">SHORTNAME</label>
                    <div class="layui-input-block">
                        <input type="text" name="text4" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">ADDRESS</label>
                    <div class="layui-input-block">
                        <input type="text" name="text5" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">PHONE</label>
                    <div class="layui-input-block">
                        <input type="text" name="text6" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">STYLENAME</label>
                    <div class="layui-input-block">
                        <input type="text" name="text7" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">USOURCE</label>
                    <div class="layui-input-block">
                        <input type="text" name="text8" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">UPDATETIME</label>
                    <div class="layui-input-block">
                        <input type="text" name="text9" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">数据来源</label>
                    <div class="layui-input-block">
                        <input type="text" name="text10" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
            </form>
        </div>
        <!--属性显示3dtitles-->
        <div class="props attribute3dtitles" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">BARNNUM</label>
                    <div class="layui-input-block">
                        <input type="text" name="text1" readonly="true" lay-verify="title" autocomplete="off"
                            placeholder="0" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">FLOOR</label>
                    <div class="layui-input-block">
                        <input type="text" name="text2" readonly="true" lay-verify="title" autocomplete="off"
                            placeholder="0" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">GEOOBJNUM</label>
                    <div class="layui-input-block">
                        <input type="text" name="text3" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">HEIGHT</label>
                    <div class="layui-input-block">
                        <input type="text" name="text4" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">OBJECTID</label>
                    <div class="layui-input-block">
                        <input type="text" name="text5" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">PNAME</label>
                    <div class="layui-input-block">
                        <input type="text" name="text6" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">PRODUCTION</label>
                    <div class="layui-input-block">
                        <input type="text" name="text7" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">PROJECTID</label>
                    <div class="layui-input-block">
                        <input type="text" name="text8" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">PROPERTY</label>
                    <div class="layui-input-block">
                        <input type="text" name="text9" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">SHape_Leng</label>
                    <div class="layui-input-block">
                        <input type="text" name="text10" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">STRUCT</label>
                    <div class="layui-input-block">
                        <input type="text" name="text11" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">Shape</label>
                    <div class="layui-input-block">
                        <input type="text" name="text12" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">Shape_Area</label>
                    <div class="layui-input-block">
                        <input type="text" name="text13" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">TYPE</label>
                    <div class="layui-input-block">
                        <input type="text" name="text14" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">UNDERFLOOR</label>
                    <div class="layui-input-block">
                        <input type="text" name="text15" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">USE</label>
                    <div class="layui-input-block">
                        <input type="text" name="text16" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">WIDTH</label>
                    <div class="layui-input-block">
                        <input type="text" name="text17" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
            </form>
        </div>
        <!--属性显示polygon-->
        <div class="props attributepolygon" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">Angle</label>
                    <div class="layui-input-block">
                        <input type="text" name="text1" readonly="true" lay-verify="title" autocomplete="off"
                            placeholder="0" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">BSM</label>
                    <div class="layui-input-block">
                        <input type="text" name="text2" readonly="true" lay-verify="title" autocomplete="off"
                            placeholder="0" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">BlkColor</label>
                    <div class="layui-input-block">
                        <input type="text" name="text3" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">BlkLineWt</label>
                    <div class="layui-input-block">
                        <input type="text" name="text4" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">BlkLinetyp</label>
                    <div class="layui-input-block">
                        <input type="text" name="text5" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">Bold</label>
                    <div class="layui-input-block">
                        <input type="text" name="text6" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">CZZB</label>
                    <div class="layui-input-block">
                        <input type="text" name="text7" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">CharacterS</label>
                    <div class="layui-input-block">
                        <input type="text" name="text8" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">CharacterW</label>
                    <div class="layui-input-block">
                        <input type="text" name="text9" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">Color</label>
                    <div class="layui-input-block">
                        <input type="text" name="text10" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">DLBM</label>
                    <div class="layui-input-block">
                        <input type="text" name="text11" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">DLBZ</label>
                    <div class="layui-input-block">
                        <input type="text" name="text12" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">DLMC</label>
                    <div class="layui-input-block">
                        <input type="text" name="text13" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">DocName</label>
                    <div class="layui-input-block">
                        <input type="text" name="text14" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">DocPath</label>
                    <div class="layui-input-block">
                        <input type="text" name="text15" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">DocType</label>
                    <div class="layui-input-block">
                        <input type="text" name="text16" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">DocVer</label>
                    <div class="layui-input-block">
                        <input type="text" name="text17" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
            </form>
        </div>
        <!--属性显示billboard-->
        <div class="props attributebillboard" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">名字</label>
                    <div class="layui-input-block">
                        <input type="text" name="text1" readonly="true" lay-verify="title" autocomplete="off"
                            placeholder="0" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">性别</label>
                    <div class="layui-input-block">
                        <input type="text" name="text2" readonly="true" lay-verify="title" autocomplete="off"
                            placeholder="0" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">手机号</label>
                    <div class="layui-input-block">
                        <input type="text" name="text3" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">出生日期</label>
                    <div class="layui-input-block">
                        <input type="text" name="text4" readonly="true" lay-verify="number" autocomplete="off"
                            placeholder="0" value="24" class="layui-input">
                        </select>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <script src="../layui/layui.js"></script>
    <script src="../jquery-2.0.3.js"></script>
    <script>
        var Viewer = parent.window.Viewer;
        var Cesium = parent.Cesium;
        var PopupData = parent.SmartEarthPopupData;
        var type = PopupData.propType;
        var editGraphic = PopupData.editGraphic;
        var typeface = "Sans-serif";
        var fontsize = "24";
        $('#Attribute').find("." + type).show();

        layui.use(['element', 'form', 'slider', 'colorpicker'], function () {
            window.element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块
            window.form = layui.form;
            window.slider = layui.slider;
            window.colorpicker = layui.colorpicker;
            // $('.props input[name="name"]').val(editGraphic.getValue('name'));
            // document.getElementById("sxlb").innerHTML
            switch (type) {
                case 'attributelable':
                    $('.attributelable input[name="text1"]').val(editGraphic["FEATUREGUI"].getValue());
                    $('.attributelable input[name="text2"]').val(editGraphic["FCODE"].getValue());
                    $('.attributelable input[name="text3"]').val(editGraphic["NAME"].getValue());
                    $('.attributelable input[name="text4"]').val(editGraphic["SHORTNAME"].getValue());
                    $('.attributelable input[name="text5"]').val(editGraphic["ADDRESS"].getValue());
                    $('.attributelable input[name="text6"]').val(editGraphic["PHONE"].getValue());
                    $('.attributelable input[name="text7"]').val(editGraphic["STYLENAME"].getValue());
                    $('.attributelable input[name="text8"]').val(editGraphic["USOURCE"].getValue());
                    $('.attributelable input[name="text9"]').val(editGraphic["UPDATETIME"].getValue());
                    $('.attributelable input[name="text10"]').val(editGraphic["数据来"].getValue());
                    break;
                case 'attribute3dtitles':
                    let obj = editGraphic.getPropertyNames();
                    $('.attribute3dtitles input[name="text1"]').val(editGraphic.getProperty(obj[0]));
                    $('.attribute3dtitles input[name="text2"]').val(editGraphic.getProperty(obj[1]));
                    $('.attribute3dtitles input[name="text3"]').val(editGraphic.getProperty(obj[2]));
                    $('.attribute3dtitles input[name="text4"]').val(editGraphic.getProperty(obj[3]));
                    $('.attribute3dtitles input[name="text5"]').val(editGraphic.getProperty(obj[4]));
                    $('.attribute3dtitles input[name="text6"]').val(editGraphic.getProperty(obj[5]));
                    $('.attribute3dtitles input[name="text7"]').val(editGraphic.getProperty(obj[6]));
                    $('.attribute3dtitles input[name="text8"]').val(editGraphic.getProperty(obj[7]));
                    $('.attribute3dtitles input[name="text9"]').val(editGraphic.getProperty(obj[8]));
                    $('.attribute3dtitles input[name="text10"]').val(editGraphic.getProperty(obj[9]));
                    $('.attribute3dtitles input[name="text11"]').val(editGraphic.getProperty(obj[10]));
                    $('.attribute3dtitles input[name="text12"]').val(editGraphic.getProperty(obj[11]));
                    $('.attribute3dtitles input[name="text13"]').val(editGraphic.getProperty(obj[12]));
                    $('.attribute3dtitles input[name="text14"]').val(editGraphic.getProperty(obj[13]));
                    $('.attribute3dtitles input[name="text15"]').val(editGraphic.getProperty(obj[14]));
                    $('.attribute3dtitles input[name="text16"]').val(editGraphic.getProperty(obj[15]));
                    $('.attribute3dtitles input[name="text17"]').val(editGraphic.getProperty(obj[16]));
                    break;
                case 'attributepolygon':
                    $('.attributepolygon input[name="text1"]').val(editGraphic["Angle"].getValue());
                    $('.attributepolygon input[name="text2"]').val(editGraphic["BSM"].getValue());
                    $('.attributepolygon input[name="text3"]').val(editGraphic["BlkColor"].getValue());
                    $('.attributepolygon input[name="text4"]').val(editGraphic["BlkLineWt"].getValue());
                    $('.attributepolygon input[name="text5"]').val(editGraphic["BlkLinetyp"].getValue());
                    $('.attributepolygon input[name="text6"]').val(editGraphic["Bold"].getValue());
                    $('.attributepolygon input[name="text7"]').val(editGraphic["CZZB"].getValue());
                    $('.attributepolygon input[name="text8"]').val(editGraphic["CharacterS"].getValue());
                    $('.attributepolygon input[name="text9"]').val(editGraphic["CharacterW"].getValue());
                    $('.attributepolygon input[name="text10"]').val(editGraphic["Color"].getValue());
                    $('.attributepolygon input[name="text11"]').val(editGraphic["DLBM"].getValue());
                    $('.attributepolygon input[name="text12"]').val(editGraphic["DLBZ"].getValue());
                    $('.attributepolygon input[name="text13"]').val(editGraphic["DLMC"].getValue());
                    $('.attributepolygon input[name="text14"]').val(editGraphic["DocName"].getValue());
                    $('.attributepolygon input[name="text15"]').val(editGraphic["DocPath"].getValue());
                    $('.attributepolygon input[name="text16"]').val(editGraphic["DocType"].getValue());
                    $('.attributepolygon input[name="text17"]').val(editGraphic["DocVer"].getValue());
                    break;
                case 'attributebillboard':
                    $('.attributebillboard input[name="text1"]').val(editGraphic["name"].getValue());
                    $('.attributebillboard input[name="text2"]').val(editGraphic["sex"].getValue());
                    $('.attributebillboard input[name="text3"]').val(editGraphic["phone"].getValue());
                    $('.attributebillboard input[name="text4"]').val(editGraphic["birthdate"].getValue());
                    break;
            }
        });
    </script>


</body>

</html>